{% extends 'layout.html' %}
{% block content %}
<div class="row-fluid">
  <div class="span12">
    <div class="iphone_style_list_wrapper">
      <ul class="iphone_style_list">
        {% if menu %}
        <div class="accordion" id="all_menu_items">
          {% for item in menu %}
            <div class="accordion-group">
              <div class="accordion-heading">
                <a class="accordion-toggle" data-toggle="collapse" data-parent="#all_menu_items" href="#item{{item.id}}">
                  {{ item.food.name }}
                  <img class="go_right_button pull-right" src="/static/img/right_arrow.png"/>
                </a>

              </div>
              <div id="item{{item.id}}" class="accordion-body collapse" style="height: 0px; ">
                <div class="accordion-inner">
                  <table class="stock_detail">
                    <tr>
                      <td class="first-column">Orders in queue</td>
                      <td>{{ item.orders_in_queue() }}</td>
                    </tr>
                    <tr>
                      <td class="first-column">Stock remaining</td>
                      <td>{{ item.remaining_orders() }}</td>
                    </tr>
                    <tr>
                      <td class="first-column">Avg wait time</td>
                      <td>{{ item.average_wait_time() }}</td>
                    </tr>
                  </table>

                  <form class="order_form" action="{{ url_for('place_order', menu_item_id = item.id) }}" method="POST">
                  <div class="row-fluid order_form_wrapper">
                    <div class="span3">
                      <a class="btn btn-success btn-quant btn-quant-minus">-</a>
                    </div>
                    <div class="span6">
                      <div class="centered">
                        {{ order_form.quantity(class="order_amount", value=1) }}
                      </div>
                    </div>
                    <div class="span3">
                      <a class="btn btn-success pull-right btn-quant btn-quant-plus">+</a>
                    </div>
                  </div>
                  <div class="row-fluid">
                    <div class="span12">
                      {{ order_form.submit(class="btn btn-primary block-item btn-large",style="margin-top:15px;width:100%") }}
                    </div>
                  </div>
                  </form>
                </div>
              </div>
            </div>
          {% endfor %}
        </div>
        {% else %}
        <p>There are no food today!</p>
        {% endif %}
      </ul>
    </div>
  </div>
</div>
{% endblock %}